<template>
    <n-tooltip trigger="hover" v-if="item.status=='RUNNING'">
        <template #trigger >
            <n-spin size="20">
                <template #icon>
                    <n-icon size="20" color="#FFA60F">
                        <RunningIcon/>
                    </n-icon>
                </template>
            </n-spin>
        </template>
        运行中
    </n-tooltip>
    <n-tooltip trigger="hover" v-if="item.status=='SUCCESS'">
        <template #trigger>
            <n-icon size="20" color="#51D6A9">
                <SuccessIcon/>
            </n-icon>
        </template>
        运行成功
    </n-tooltip>
    <n-tooltip trigger="hover" v-if="item.status=='FAILED'">
        <template #trigger>
            <n-icon size="20" color="#EC2B24">
                <FailedIcon/>
            </n-icon>
        </template>
        运行失败
    </n-tooltip>
    <n-tooltip trigger="hover" v-if="item.status=='PENDING'">
        <template #trigger>
            <n-icon size="20" color="#B4A992">
                <PendingIcon/>
            </n-icon>
        </template>
        待机中
    </n-tooltip>
</template>

<script setup lang="ts">

import {NIcon, NSpin} from "naive-ui";

import {
    CheckmarkCircle as SuccessIcon,
    CloseCircle as FailedIcon,
    ReloadCircleOutline as RunningIcon,
    StopCircle as PendingIcon
} from "@vicons/ionicons5";

const props = defineProps([
    "item"
])

</script>

<style scoped lang="scss">

</style>
